<template>
    <div class="wrapper">
        <a-tabs v-model:activeKey="activeKey" class="tabs" @change="clickTab">
            <a-tab-pane key="1" tab="企业素材库"> </a-tab-pane>
            <a-tab-pane key="2" tab="个人素材库" force-render></a-tab-pane>
        </a-tabs>
        <div class="material-box-flex">
            <MaterialLibrary />
        </div>
    </div>
</template>

<script setup lang="ts">
import MaterialLibrary from "@/pages/WeChat/components/MaterialLibrary.vue";
import {ref} from "vue";

function clickTab(key) {
    console.log(key, "--");
}
const activeKey = ref("1");
</script>

<style scoped lang="less">
.tabs {
    background: #fff;

    :deep(.ant-tabs-nav) {
        margin: 0 !important;
        padding-left: 20px;
    }
}
.flex-up {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;

    .material-box-flex {
        display: flex;
        justify-content: space-between;
        flex-grow: 1;
        overflow: auto;
    }
}
</style>
